import React from 'react';
import './index.css';

const players = [
  { id: 1, name: '梅西', position: '前锋', number: 10 },
  { id: 2, name: 'C罗', position: '前锋', number: 7 },
  { id: 3, name: '德布劳内', position: '中场', number: 17 },
  { id: 4, name: '范戴克', position: '后卫', number: 4 },
  { id: 5, name: '诺伊尔', position: '门将', number: 1 },
];

function PlayerList() {
  return (
    <div className="player-list-container">
      <h2>球员列表</h2>
      <table className="player-table">
        <thead>
          <tr>
            <th>姓名</th>
            <th>位置</th>
            <th>号码</th>
          </tr>
        </thead>
        <tbody>
          {players.map(player => (
            <tr key={player.id}>
              <td>{player.name}</td>
              <td>{player.position}</td>
              <td>{player.number}</td>
            </tr>
          ))}
        </tbody>
      </table>
    </div>
  );
}

export default PlayerList; 